import React, { Component } from 'react'

import { Link } from "react-router-dom"

import menuList from '../../config/menuConfig/index.js';
import { Menu, Icon } from 'antd';
import "./left-nav.less";
const { SubMenu } = Menu;
export default class LeftNav extends Component {
    getMenuNodes = (menu) => {
        return menu.map(item => {
            if (item.children) {
                return (<SubMenu
                    key="sub1"
                    title={
                        <span>
                            <Icon type="mail" />
                            <span>商品管理</span>
                        </span>
                    }
                >
                    <Menu.Item key="5">
                        <Link to="/charts">
                            <Icon type="pie-chart" />
                            <span>商品统计</span>
                        </Link>
                    </Menu.Item>
                    <Menu.Item key="6">
                        <Link to="/product">
                            <Icon type="pie-chart" />
                            <span>商品订单</span>
                        </Link>
                    </Menu.Item>
                </SubMenu>)
            } else {
                return (<Menu.Item key="1">
                    <Link to="/home">
                        <Icon type="pie-chart" />
                        <span>首页</span>
                    </Link>
                </Menu.Item>)
            }
        })
    }
    render() {
        return (
            <div className="left-nav-container">
                <Link to="/home">
                    <div className="left-nav-header">
                        vvmily系统
                    </div>
                </Link>
                <Menu
                    mode="inline"
                    theme="dark"
                >
                    {
                        this.getMenuNodes(menuList)
                    }


                    <Menu.Item key="1">
                        <Link to="/home">
                            <Icon type="pie-chart" />
                            <span>首页</span>
                        </Link>
                    </Menu.Item>

                    <SubMenu
                        key="sub1"
                        title={
                            <span>
                                <Icon type="mail" />
                                <span>商品管理</span>
                            </span>
                        }
                    >
                        <Menu.Item key="5">
                            <Link to="/charts">
                                <Icon type="pie-chart" />
                                <span>商品统计</span>
                            </Link>
                        </Menu.Item>
                        <Menu.Item key="6">
                            <Link to="/product">
                                <Icon type="pie-chart" />
                                <span>商品订单</span>
                            </Link>
                        </Menu.Item>
                    </SubMenu>

                </Menu>
            </div>
        )
    }
}


